import { View } from '@tarojs/components';
import React from 'react';
import ProductList from '../ProductList';
import styles from './index.module.scss';

const ExpiredArea = ({ productList, onDelete }) => {
  if (!productList?.length) {
    return null;
  }

  return (
    <View className={styles.ExpiredArea}>
      <View className="header">
        <View className="title">失效商品</View>
        <View
          className="action customePageStyle"
          onClick={() => {
            onDelete(productList);
          }}
        >
          清除失效商品
        </View>
      </View>

      <ProductList productList={productList} />
    </View>
  );
};

export default ExpiredArea;
